/*
 * scumix.swat.spark.DataGrid
 * 日期选择器
 *
 * author: scumyang
 * create: 2009-12-29
 * update: 2009-12-30
 * notes : 需导入 scumix.swat.swat3.js
 */

/*
用法:
	
1.声明变量:
var t = null;

2.初始化:
$.pageReady(function()
{
	t = new scumix.swat.spark.DataGrid( '容器元素', { elName:'表格元素id', rows:行数, cols:列数 } );
});

3.数据:
添加列: dg.addColumn( new SPARK.Column( 'id', {width:30} ));
添加行: dg.addLine( [['abc'],['123'],['aaa']], {height:30} );
读/写值: dg.cell( 1,0,'xxxx');
事件:
dg.onDrawCell = function( AO )
	{
		if( AO.column.caption == 'score' )
		{
			AO.text = '<button exID="' + AO.row + '" onclick="btnClick(this)">edit</button>';
		}
	}

	dg.onMouseMove = function( AO )
	{
		document.title = "R="+AO.row+"C="+AO.col+"V="+dg.cell(AO.row,AO.col);
	}

*/

scumix.swat.List = $.newClass();
scumix.swat.List.prototype =
{
	constructor: function( T, A )
	{
		this.items = new Array();
		this.count = 0;
	},

	put: function( A )
	{
		this.items.push( A );
		this.count = this.items.length;
		return this;
	},

	get: function( A )
	{
		return this.items[A];
	},

	clear: function()
	{
		this.items.length = 0;
		this.count = 0;
	}
}


scumix.swat.spark.Column = $.newClass();
scumix.swat.spark.Column.prototype =
{
	constructor: function( T, A )
	{
		// Default Arguments
		this.Da =
		{
			caption: 'column',
			className: 'SxDataGrid_Column',
			width: -1,
			height: 22,
			resizable: 1,
			clickable: 1
		}

		// Overwrites Da
		$.copy( A, this.Da );

		this.caption = T == null ? 'column' : T;
		this.className = this.Da.className;
		this.width = this.Da.width;
		this.height = this.Da.height;
		this.resizable = this.Da.resizable;
		this.clickable = this.Da.clickable;
	}
}

// DataGrid
scumix.swat.spark.DataGrid = $.newClass();
scumix.swat.spark.DataGrid.prototype =
{
	constructor: function( E, A )
	{
		this.Da =
		{
			elName: 'SxDG',
			className: 'SxDataGrid',
			cellSpacing: 0,
			cellPadding: 0,
			border: 0,
			width: '100%',
			rows: 0,
			cols: 0,
			columnResize: true,
			hotTrack: 1,
			lineColorMark: 2,
			lineHeight: 25,
			readOnly: 0
		};
		$.copy( A, this.Da );

		this.id = $.makeGlobalId( 'SxDataGrid' );
		this.EContainer = $E( E );
		this.ElName = this.Da.elName;
		this.Dom_Header = 0;
		this.onDrawCell = 0;
		this.onMouseMove = 0;
		this.columns = new scumix.swat.List();
		this.cells = 0;
		this.header = 0;
		this.headerDummyCell = 0;
		this.colNum = this.Da.cols;
		this.rowNum = this.Da.rows;
		this.hotRow = this.hotCol = -1;
		this.initView( E, A );
	},

	initView: function()
	{
		var tb = $.createElement( { type:'table', id:this.id, attr:{ className:this.Da.className,exDragable:1,exTopOnDrag:1 } } );
			tb.id = tb.name = this.Da.elName;
			tb.cellSpacing = this.Da.cellSpacing;
			tb.cellPadding = this.Da.cellPadding;
			tb.border = this.Da.border;
			tb.style.width = this.Da.width;
			$( tb ).addEvent( 'mousemove', this.DoTableMove.bind( this, tb ) );
		var tbd = document.createElement( 'tbody' );

		tb.appendChild( tbd );
		this.EContainer.appendChild( tb );
		this.DomObj = tb;

		// Create dummy-cell in header
		this.headerDummyCell = this.addColumn( new SPARK.Column( ' ', {resizable:0,clickable:0,className:'RGap'} ));
		this.headerGap = 0;

		// Create cell editor
		if( !this.readOnly ) this.createEditor();
	},

	//-- Methods --------------------------------------------
	// Add one row into grid
	createEditor: function()
	{
		this.EEditor = $.createElement( {type:'input',id:this.id + '_Editor',css:'position:absolute;display:none',attr:{className:'SxDataGrid_Editor',type:'text'}} );
		this.DomObj.appendChild( this.EEditor );
	},

	addRow: function( A )
	{
		var tr = this.DomObj.insertRow( -1 );
		if( this.header )
		{
			tr.exRowId = this.rowNum;

			// bind events
			var tro = $( tr );
				tro.addEvent( 'mouseover', this.DoLineOver.bind( this, tr ) );
				tro.addEvent( 'mouseout', this.DoLineOut.bind( this, tr ) );

			// line color-mark
			if( ( this.rowNum + 1 ) % this.Da.lineColorMark == 0 )
			{
				tr.className = 'SxDataGrid_LineOdd';
				tr.exOrgCls = 'SxDataGrid_LineOdd';
			}
			else
			{
				tr.className = 'SxDataGrid_Line';
				tr.exOrgCls = 'SxDataGrid_Line';
			}

			// increase row number counter
			this.rowNum++;
		}

		return tr;
	},

	// Add one column into grid
	addColumn: function( A )
	{
		// Create header-row if not have one
		if( !this.header )
		{
			this.header = this.addRow();
			this.header.className = 'hdr';
		}
		else this.columns.put( A );

		// Append new cell
		var td = this.DomObj.rows(0).insertCell( this.headerGap++ );
		A.className ? td.className = A.className : 1;
		td.innerText = A.caption;
		//td.innerHTML = '<div style="width:100%;overflow:hidden;text-overflow:ellipsis;word-break:keep-all;white-space:nowrap">' + A.caption + '</div>';

		//td.style.
		td.exColId = this.headerGap - 1;
		if( A.clickable ) $(td).addEvent( 'click', this.DoHeaderClick.bind( this, this.columns.get( td.exColId ) ));

		// Properties of new cell
		if( A.resizable )
		{
			td.setAttribute( 'exDragable', "1" );
			td.setAttribute( 'exSizable', "1" );
			td.setAttribute( 'exHotPos', "R" );
		}
		A.width > 0 ? td.style.width = A.width : 1;

		this.colNum++;

		return td;
	},

	// Add new data-line into grid
	addLine: function( T, A )
	{
		var tr = this.addRow( A );
		if( A ) for( var i in A ) tr[i] = A[i];
		tr.style.height = this.Da.lineHeight;

		for( var i=0; i<this.columns.count; i++ )
		{
			if( !T[i] ) break;
			var td = tr.insertCell( -1 );

			for( var ai in T[i][1] ) td[ai] = T[i][1][ai];
			//td.style.height = this.Da.lineHeight;
			if( this.columns.get(i).width > 0 ) td.style.width = this.columns.get(i).width;
			td.exColId = i;
			$(td).addEvent( 'click', this.DoCellClick.bind( this, td ) );
			//$(td).addEvent( 'mouseover', this.DoCellOver.bind( this, td ) );
			//$(td).addEvent( 'mouseout', this.DoCellOut.bind( this, td ) );

			// Callback
			if( this.onDrawCell )
			{
				var ao = {col:td.exColId, row:tr.exRowId, tr:tr, td:td, column:this.columns.get(i), text:T[i][0]};
				this.onDrawCell( ao );
				td.innerHTML = ao.text;
			}

			else td.innerText = T[i][0];
		}
	},

	clear: function()
	{
		for( var i=0; i<this.rowNum; i++ )
		{
			this.DomObj.deleteRow( 1 );
		}
		this.rowNum = 0;
	},

	// Get/Set data in grid cells
	cell: function( R, C, V )
	{
		R = parseInt( R ) || 0;
		C = parseInt( C ) || 0;
		if( R < 0 || C < 0 || R > this.rowNum - 1 || C > this.colNum - 2 ) return this;

		if( V )
		{
			//this.cells[R][C] = V;
			this.DomObj.rows( R + 1 ).cells( C ).innerText = V;
			return this;
		}

		else
			return this.DomObj.rows( R + 1 ).cells( C ).innerText;
	},

	// Re-draw grid
	redraw: function()
	{
		for( var ri=0; ri<this.Da.rows; ri++ )
		{
			for( var ci=0; ci<this.Da.cols; ci++ )
			{
				//this.DomObj.cells
			}
		}
	},

	//-- Events --------------------------------------------
	DoLineOver: function( E, A )
	{
		var tr = A[1];

		// Update properties
		this.hotRow = tr.exRowId;

		// Default action
		if( this.Da.hotTrack ) tr.className = 'SxDataGrid_Line_h';
	},

	DoLineOut: function( E, A )
	{
		var tr = A[1];

		// Default action
		if( this.Da.hotTrack ) tr.className = tr.exOrgCls;
	},

	DoCellOver: function( E, A )
	{
	},

	DoCellOut: function( E, A )
	{
	},

	DoTableMove: function( E, A )
	{
		var td = $.getTarget( E ), tb = A[1];

		// Update properties
		if( td.nodeName == 'TD' && td.exColId ) this.hotCol = td.exColId;

		// Callback
		if( this.onMouseMove ) this.onMouseMove( {row:this.hotRow, col:this.hotCol, event:E } );
	},

	DoHeaderClick: function( E, A )
	{
		var td = $.getTarget( E ), c = A[1];
		var s = new Array();
		for( var i=0; i<this.rowNum; i++ )
		{
			s[i] = this.cell( i, td.exColId );
		}
		$.trace( s.sort(function(a,b){return b>a}) );
	},

	DoCellClick: function( E, A )
	{
		var td = A[1];
		if( !this.Da.readOnly )
		{
			var eo = $( this.EEditor ), tdp = $( td ).absPos();
			eo.moveTo( tdp.left, tdp.top );
			eo.resizeTo( td.offsetWidth - 5, td.offsetHeight - 5 );
			eo.value( td.innerText );
			eo.show();
			eo[0].select();
			eo[0].focus();
		}
	}
}
